import { useState } from 'react';
function computed(n) {
  console.log(123);
  return n + 1 + 2 + 3; //复杂运算
}
function App() {
  // const [count, setCount] = useState(computed(0));
  const [count, setCount] = useState(() => computed(0)); //初始值是computed方法可能复杂运算得到的，怎么缓存，使用箭头函数可实现
  // const [doubleCount, setDoubleCount] = useState(0);
  const doubleCount = count * 2; //根据状态会重新渲染函数组件的特性，利用当前状态快照生成对应计算变量,不想要重新使用 useState 定义
  const handleClick = () => {
    setCount(count + 1);
    // setDoubleCount(count * 2);
  };
  return (
    <div>
      hello App
      <button onClick={handleClick}>点击+1</button>
      <div>
        {count},{doubleCount}
      </div>
    </div>
  );
}

export default App;
